var prepage = 2;
var page = 1;
var pages = 0;
var comments = [];

// 点击提交评论的按钮
$('#messageBtn').on('click',function(){
    // 
    $.ajax({
        type: 'POST',
        url: '/api/comment/post',
        data: {
            contentid: $('#contentId').val(),
            content: $('#messageContent').val()
        },
        success: function(responseData){
            // console.log(responseData)
            $('#messageContent').val('');
            comments = responseData.data.comments.reverse();
            renderComment();
        }
    })
})

// 每次页面重载的获取该文章的所有评论
$.ajax({
    type: 'get',
    url: '/api/comment',
    data: {
        contentid: $('#contentId').val()
    },
    success: function(responseData){
        comments = responseData.data.reverse();
        renderComment();
    }
})

// 通过事件委托给a添加点击事件
$('.pager').delegate('a','click',function(){
    // alert(1)  如果点击的a的父级有 previous类，则说明点击的是上一页按钮
    if($(this).parent().hasClass('previous')){
        // alert(1)
        page --;
    }else{
        // alert(2)
        page ++;
    }
    renderComment()
})


function renderComment(){
    $('#messageCount').html(comments.length)
    pages = Math.max(Math.ceil(comments.length / prepage),1)
    var start = Math.max(0,(page - 1) * prepage);
    var end = Math.min(start + prepage,comments.length);
    var $li = $('.pager li');
    $li.eq(1).html(page + '/' + pages)
    // 处理上一页 下一页
    if(page <= 1){
        page = 1;
        $li.eq(0).html('<span>没有上一页</span>')
    }else{
        $li.eq(0).html('<a href="javascript:;">上一页</a>')
    }
    if(page >= pages){
        page = pages;
        $li.eq(2).html('<span>没有下一页</span>')
    }else{
        $li.eq(2).html('<a href="javascript:;">下一页</a>')
    }


    // 如果没有留言处理
    if(comments.length == 0){
        $('.messageList').html('<div class="messageBox"><P>还没有评论</P></div>')
    }else{
        var html = ''
        for(var i = start;i < end;i++){
            html += '<div class="messageBox">'+
                    '<p class="name clear"><span class="f1">'+ comments[i].username +'</span><span class="f1">'+ formDate(comments[i].postTime) +'</span></p>'+
                    '<p>'+ comments[i].content +'</p>'+
                    '</div>'
        }
        $('.messageList').html(html)
    }
    
}

function formDate(d){
    var date1 = new Date(d);
    return date1.getFullYear() + '年' + (date1.getMonth()+1) + '月' + date1.getDate() + '日' + date1.getHours() + ':' + date1.getMinutes() + ':' + date1.getSeconds();
}

